import { Badge, Button, Table, Tag, Modal, Radio, Form } from 'antd';
//import { Button, Checkbox, Form, Input, Select, Space, Spin, InputNumber, Table, DatePicker,Radio } from 'antd';
import { useState, useEffect, useRef } from 'react'
import FetchHelper from "../../../../../../../utils/helper/fetch-helper";
import dayjs from 'dayjs';
import { EnvironmentOutlined } from '@ant-design/icons';
import JcyjApi from '../../../../../../../utils/apis/JcyjApi';
import ScrollTable from '../../../../../../common/ScrollTable';
import DangerDel from '../DangerDel';
export default function TypeList(props) {
    const { typeId, typeName } = props;
    const [form] = Form.useForm();
    const [page, setPage] = useState(1);
    const [total, setTotal] = useState(0);
    const [datas, setDatas] = useState([]);
    const [loading, setLoading] = useState();
    const [refreshFlag, setRefreshFlag] = useState({});
    const { currentDelItem, setCurrentDelItem, data, setData } = props;
    const [isfbState, setIsfbState] = useState();
    //-修改状态弹窗开关-
    const [Modalopen, setModalOpen] = useState(false);
    //-状态-
    const [publish, setPublish] = useState();
    //-存储状态参数-
    const [pubstate, setPubstate] = useState();
    //状态完成后引起页面刷新
    const [S_pubstate, setSPubstate] = useState();
    //2024.1.24P
    // useEffect(() => {
    //     let Q_pubstate

    //     if (Q_pubstate === pubstate) {

    //     } else {
    //         Q_pubstate = pubstate
    //         if (publish === "发布") {
    //             Q_pubstate.isfb = '1'
    //             JcyjApi.Revise_yjsjb(Q_pubstate).then((e) => {
    //                 setSPubstate(e)
    //             })
    //         } else if (publish === "解除") {
    //             Q_pubstate.isfb = '2'
    //             JcyjApi.Revise_yjsjb(Q_pubstate).then((e) => {
    //                 setSPubstate(e)
    //             })
    //         }
    //     }


    //     //console.log(publish,Q_pubstate)
    // }, [publish, pubstate])
    useEffect(() => {
        setLoading(true);
        JcyjApi.warningList(typeName, page).then(resp => {
            setDatas(resp.rows);
            setTotal(resp.total)
        }).finally(e => {
            setLoading(false);
        })
    }, [typeName, page, refreshFlag, S_pubstate, publish]);
    const onFinish = (values) => {
        console.log(values)
        // values.isfb="0"
        // values.jbys="红色"
        // //idDatas.xq=JSON.stringify(values.xqJson)
        // //const a=JSON.stringify(values)
        // FetchHelper.putJson(`/admin-api/ybyj/yjsjb`,values).then(resp=>{ alert("修改成功") }).catch(err => { alert("修改失败") })
    }
    const rootRef = useRef();
    const columns = [{
        title: '预警标题',
        dataIndex: 'yjbt',
        width: 140
    }, {
        title: '预警时间',
        dataIndex: 'sj',
        width: 160,
        render: (text) => {
            return text
        }
    },
    {
        title: '事件等级',
        dataIndex: 'jbys',
        width: 120,
        render: (text, record) => {
            //console.log("record.jbys:", record.jbys==="重大事故"); // 调试信息，检查jbys的值
            switch (record.jbys?.trim()) {
                case "4": return <Badge color="blue" text={"一般事件"}></Badge>
                case "3": return <Badge color="yellow" text={"较大事件"}></Badge>
                case "2": return <Badge color="orange" text={"重大事件"}></Badge>
                case "1": return <Badge color="red" text={"特别重大事件"}></Badge>
                default:
                    return <Badge color="white" text={"无事件等级"}></Badge>;
            }
        }
    }, {
        title: '事件类型',
        dataIndex: 'jstype',
        width: 100,
        render: (text, record) => {

            let state;
            if (record.jstype === '1') {
                state = "一般事件";
            } else if (record.jstype === '2') {
                state = "应急事件";
            }
            // else if (record.jstype === '3') {
            //     state = "较大事故";
            // }
            // else if (record.jstype === '4') {
            //     state = "一般事故";
            // }
            else if (record.jstype === null) {
                state = "未处理";
            }
            //console.log("typeof record,", record.isfb, state)
            return <Button
                type="link"
                size="small"
                onClick={record => {
                    //alert(record.jstype)
                }}
            >{state}</Button>
        }
    },
    {
        title: '操作',
        //dataIndex: 'isfb',
        width: 160,
        render: (text, record) => {
            return (<><Button type="link" onClick={e => {
                setCurrentDelItem(record)
                console.log(typeof record, record)

            }}>待办任务</Button>
            </>)
        }
    },
    {
        title: '状态',
        dataIndex: 'isfb',
        width: 100,
        render: (text, record) => {
            let state;
            if (record.isfb === '0' || record.isfb === null) {
                state = "未处理";
            } else if (record.isfb === '1') {
                state = "发布";
            } else if (record.isfb === '2') {
                state = "解除";
            } else {
                state = "未处理";
            }
            //console.log("typeof record,", record.isfb, state)
            return <Button
                type="link"
                size="small"
                onClick={e => {
                    // setPubstate(record)
                    // form.setFieldsValue({ isfb: `${record?.isfb}`, jstype: `${record?.jstype}` })
                    // setModalOpen(true)
                }}
            >{state}</Button>
        }
    },
    {
        title: '审批状态',
        dataIndex: 'isfb',
        width: 100,
        render: (text, record) => {
            let state;
            if (record.isfb === '0' || record.isfb === null) {
                state = "待审批";
            } else {
                state = "已审批";
            }
            //console.log("typeof record,", record.isfb, state)
            return <Button
                type="link"
                size="small"
                onClick={e => {
                    setPubstate(record)
                    form.setFieldsValue({ isfb: `${record?.isfb}`, jstype: `${record?.jstype}`,jbys:`${record?.jbys}` })
                    setModalOpen(true)
                }}
            >{state}</Button>
        }
    },];

    // useEffect(() => {
    //     setLoading(true);
    //     JcyjApi.TqList({ "type": "预警"}).then(resp => {
    //         console.log("@!23",resp)
    //         setDatas(resp.rows);
    //         // setTotal(resp.total)
    //     }).finally(e => {
    //         setLoading(false);
    //     })
    // }, [typeName, page, refreshFlag]);

    // const rootRef = useRef();

    // const columns = [{
    //     title: '时间',
    //     dataIndex: 'id',
    //     width: 140
    // }, {
    //     title: '标题',
    //     dataIndex: 'title',
    //     width: 300,
    //     render: (text) => {
    //         return text
    //     }
    // },
    // {
    //     title: '详情',
    //     dataIndex: 'url',
    //     width: 80,
    //     render: (text, record) => {
    //         return <Button type="link" href={record.url} onClick={e => {

    //         }}>详情 </Button>


    //     }
    // },
    // {
    //     title: '操作',
    //     dataIndex: 'isfb',
    //     width: 160,
    //     render: (text, record) => {
    //         return <Button type="link"onClick={e => {
    //             setCurrentDelItem(record)
    //             //console.log(typeof record,record)

    //         }}>待办任务</Button>
    //     }
    // }, {
    //     title: '其他',
    //     dataIndex: 'yjxxnr',
    //     ellipsis: true
    // }];

    return <div style={{
        // marginTop: -10,
        height: 285,
        overflow: "hidden",
        padding: 8
    }} ref={rootRef}>
        {/* <div style={{
            paddingBottom: 8
        }}>
            <Button size="small" type="primary">统计分析</Button>
        </div> */}
        <ScrollTable
            parentNode={rootRef.current}
            bordered
            loading={loading}
            size='small'
            columns={columns}
            dataSource={datas}
            pagination={{
                current: page,
                total: total,
                onChange: (page) => {
                    setPage(page)
                }
            }}
            rowClassName={(record, index) => {
                if (index % 2 === 0) {
                    return 'own-row'
                }
            }}
        ></ScrollTable>
        <DangerDel item={currentDelItem} onCancel={e => {
            setCurrentDelItem(null);
        }} onOk={e => {
            setRefreshFlag({});
            setCurrentDelItem(null);
        }} data={data} setData={setData} />
        <Modal
            title="预警状态"
            open={Modalopen}
            onOk={e => {
                
                
                form.validateFields().then(values => {
                    let canshu={id:'',jbys:'',isfb:'',spyj:''}
                    canshu.id=pubstate.id
                    canshu.jbys=values.jbys
                    //canshu.jbys=a=>{values.jbys}
                    canshu.isfb=values.isfb
                    // console.log(pubstate)
                    // console.log(values)
                    // if(values.isfb==='1'){
                    //     values.jbys="红色"
                    // }else{
                    //     values.jbys=""
                    // }
                    //const a=values;
                    //form.resetFields(); // 重置表单字段的值
                    setPublish(values)

                    FetchHelper.putJson(`/admin-api/ybyj/yjsjb`, {
                        ...pubstate,
                        ...values,

                    }).then(resp => {

                    }).finally(e => {

                    })
                    FetchHelper.putJson(`/admin-api/app/sp/submit`, {
                        ...canshu
                    }).then(resp => {

                    }).finally(e => {

                    })
                    if (values.isfb === '1') {
                        console.log('values', values,pubstate)
                        //const url='';当修改状态为发布时跳转
                        //window.location.href = 'http://218.6.151.129:8088/yjemerg/login/navLink.action?navid=50657';
                    }

                })


                setModalOpen(false)
            }}
            onCancel={e => {

                setModalOpen(false)
            }}
            width={350}
            mask={false}
            closable={false}
            maskClosable={false}

            bodyStyle={{
            }}
        >
            <div>
                <Form

                    form={form}
                >
                    <div>
                        <Form.Item label="事件类型" name="jstype">
                            <Radio.Group>
                                <Radio value="1"> 一般事件</Radio>
                                <Radio value="2"> 应急事件  </Radio>
                            </Radio.Group>
                        </Form.Item>
                        <Form.Item label="事件等级" name="jbys">
                            <Radio.Group >
                                <Radio value="1"> 特别重大事件 </Radio>
                                <Radio value="2"> 重大事件 </Radio>
                                <Radio value="3"> 较大事件 </Radio>
                                <Radio value="4"> 一般事件 </Radio>
                            </Radio.Group>
                        </Form.Item>


                    </div>
                    <div>
                        <Form.Item label="是否发布" name="isfb">
                            <Radio.Group>
                                <Radio value="1"> 发布 </Radio>
                                <Radio value="2"> 解除 </Radio>
                            </Radio.Group>
                        </Form.Item>
                    </div>

                </Form>
            </div>
        </Modal>
    </div>;
}